<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/page/inc/taglib.jsp"%>
<style>
.buttonRight{
 position: absolute;
 left: 525px;
 bottom: 3px;
}
</style>
<div class="pageContent">
	<form method="post" id="form" action="${pageContext.request.contextPath}${requestScope.record ==null ?'/merchant/merchantProduct/insert' :'/merchant/merchantProduct/update' }" class="pageForm required-validate">
		<div class="pageFormContent" layoutH="56">
			<!-- 关闭窗口 -->
			<input type="hidden" name="callbackType" value="closeCurrent" />
			<!-- 隐藏表单 -->

			<c:if test="${requestScope.record !=null}">
				<input type="hidden" name="merchantProductId" value="${requestScope.record.merchantProductId}" />
				<input type="hidden" name="state" value="${requestScope.record.state}" />
				<input type="hidden" name="addTime" value='<fmt:formatDate pattern="yyyy-MM-dd" value="${requestScope.record.addTime}"/>' />
			</c:if>
			<p>
				<label>商品分类</label> <select name="merchantProductTypeId">
					<c:forEach items="${requestScope.typeAll}" var="types">
						<option value="${types.merchantProductTypeId}" ${types.merchantProductTypeId == requestScope.record.merchantProductTypeId?"selected":""}>${types.productTypeName}</option>
					</c:forEach>
				</select>
			</p>
			<p>
				<label>商品名</label> <input name="productName" class="required" maxlength="50" type="text" value="${requestScope.record.productName}" />
			</p>
			<c:if test="${requestScope.record == null}">
			<p>
				<label>商品编号</label> <input name="productNum" class="required" maxlength="100" type="text" value="${requestScope.pn.productNum}" />
			</p>
			<p>
				<label>进货价</label> <input id="primeCostsPrice" class="required number" maxlength="16" type="text" value="${requestScope.pn.primeCostsPrice}" />
			</p>
			<p>
				<label>建议售卖价格</label> <input id="suggestedPrice" class="required number" maxlength="16" type="text" value="${requestScope.pn.suggestedPrice}" />
			</p>
			<p>
				<label>产地</label> <input name="place" class="required" maxlength="50" type="text" value="${requestScope.record.place}" />
			</p>
			<p>
				<label>等级</label> <input name="level" class="required" maxlength="50" type="text" value="${requestScope.record.level}" />
			</p>
			<p>
				<label>容量</label> <input name="capacity" class="required" maxlength="50" type="text" value="${requestScope.record.capacity}" />
			</p>
			<p>
				<label>装箱率</label> <input name="pack" class="required" maxlength="50" type="text" value="${requestScope.record.pack}" />
			</p>
			<p>
				<label>加盟价</label> <input id="fcpc" class="required number" maxlength="11" type="text" value="${requestScope.record.fcpc}" />
			</p>
			<p>
				<label>葡萄品种</label> <input name="gpvt" class="required" maxlength="50" type="text" value="${requestScope.record.gpvt}" />
			</p>
			<p>
				<label>最佳饮用温度</label> <input name="odpt" class="required" maxlength="50" type="text" value="${requestScope.record.odpt}" />
			</p>
			<p>
				<label>酒评</label> <input name="wirv" class="required" maxlength="50" type="text" value="${requestScope.record.wirv}" />
			</p>
			<p>
				<label>佐餐建议</label> <input name="mrcm" class="required" maxlength="50" type="text" value="${requestScope.record.mrcm}" />
			</p>
			<p>
				<label>醒酒时间</label> <input name="sbtm" class="required" maxlength="50" type="text" value="${requestScope.record.sbtm}" />
			</p>
			</c:if>
			<p>
				<div id="parameter" class="nowrap">
					<!-- 没数据是显示 -->
					<c:if test="${fn:length(requestScope.parameter)==0}">
						<div class="unit">
							<label>商品参数</label>
							<input name="customProperties" type="hidden" value="" />
							
							 参数名<input style="float: inherit;" class="textInput parameterKey" onchange="changeParameter()" maxlength="11" type="text" value="" />
							 参数值<input style="float: inherit;" class="textInput parameterValue" onchange="changeParameter()" maxlength="100" type="text" value="" />
							     <!-- <input class="button" style="margin-left: 10px" type="button" onclick="javascript:addParameter()" value="＋自定义参数"/> -->
								 <a class="button buttonRight" href="javascript:addParameter();"><span >＋自定义参数</span></a>
						</div>
					</c:if>
					<!-- 有数据是显示 -->
					<c:forEach items="${requestScope.parameter}" var="item" varStatus="status">
						<div class="unit">
							<c:if test="${status.index==0 }">
							<label>自定义参数</label>
							<input name="customProperties" type="hidden" value="" />
							</c:if>
							<c:if test="${status.index!=0 }">
							<label>&nbsp;</label>
							</c:if>
							 参数名<input style="float: inherit;" class="required parameterKey" onchange="changeParameter()" maxlength="11" type="text" value="${item.key}" />
							 参数值<input style="float: inherit;" class="required parameterValue" onchange="changeParameter()" maxlength="100" type="text" value="${item.value}" />
							<c:if test="${status.index==0 }">
								<a class="button buttonRight" href="javascript:addParameter();"><span>＋自定义参数</span></a>
							</c:if>
						</div>
					</c:forEach>
				</div>
			</p>
			<p>
			<div class="unit">
				<label>商品封面上传</label> <a href="${pageContext.request.contextPath}/merchant/merchantProduct/getMerchantAsset?returnPage=cover" lookupGroup="org1"> 
					<div class="upload-wrap">
						<div class="thumbnail">
							<img id="shopAssetUrlimg" src="${requestScope.record.shopAssetUrl}" style="max-width: 80px; max-height: 80px">
							<input id="shopAssetUrl" name="shopAssetUrl" value="" type="hidden" />
						</div>
					</div>
				</a>
			</div>
			</p>
			<p>
			<div class="unit">
				<label>商品列表图上传</label> <a href="${pageContext.request.contextPath}/merchant/merchantProduct/getMerchantAsset" lookupGroup="org3">
					<div id="shopAssetUrlimgs">
						<!-- 没数据是显示 -->
						<c:if test="${fn:length(requestScope.pics)==0}">
							<div class="upload-wrap">
								<div class="thumbnail">
									<img id="shopAssetUrlimg" src="${item.merchantAssetUrl}" style="max-width: 80px; max-height: 80px">
									<input name="picUrls" value="${item.merchantAssetUrl}" type="hidden" />
								</div>
							</div>
						</c:if>
						<!-- 有数据是显示 -->
						<c:forEach items="${requestScope.pics}" var="item">
							<div class="upload-wrap">
								<div class="thumbnail">
									<img id="shopAssetUrlimg" src="${item.merchantAssetUrl}" style="max-width: 80px; max-height: 80px">
									<input name="picUrls" value="${item.merchantAssetUrl}" type="hidden" />
								</div>
							</div>
						</c:forEach>
					</div>
				</a>
			</div>
			</p>
		</div>
		<div class="formBar">
			<ul>
				<!--<li><a class="buttonActive" href="javascript:;"><span>保存</span></a></li>-->
				<li><div class="buttonActive">
						<div class="buttonContent">
							<button type="submit">保存</button>
						</div>
					</div></li>
				<li>
					<div class="button">
						<div class="buttonContent">
							<button type="button" class="close">取消</button>
						</div>
					</div>
				</li>
			</ul>
		</div>
	</form>
</div>
<script type="text/javascript">
	function setAssetUrl(picUrljson) {
		$("#shopAssetUrl").attr("value", picUrljson.picUrl);
		$("#shopAssetUrlimg").attr("src", picUrljson.picUrl);
	}
	function setpicUrls(picUrls) {
		var picsHtml="";
		for(i in picUrls){
			var json = eval("("+picUrls[i]+")");
			picsHtml+=
			"<div class='upload-wrap'>                                                         "
			+"	<div class='thumbnail'>                                                        "
			+"		<img id='shopAssetUrlimg' src='"+json.picUrl+"' style='max-width: 80px; max-height: 80px'>"
			+"		<input name='picUrls' value='"+json.picUrl+"' type='hidden' />"
			+"	</div>                                                                         "
			+"</div>                                                                            ";
		}
		$("#shopAssetUrlimgs").html(picsHtml);
	}
	function addParameter(){
		$("#parameter").append(
				"<div class='unit'>                                                                                                                                                        "
				+"	<label>&nbsp;</label>                                                                                                             "
				+"	参数名<input style='float: inherit;' class='textInput parameterKey' onchange='changeParameter()' maxlength='11' type='text' value='' />                    "
				+"	参数值<input style='float: inherit;' class='textInput parameterValue' onchange='changeParameter()' maxlength='100' type='text' value='' />"
				+"</div>                                                                                                                              ");
	}
	
	function changeParameter(){
		var key =[];
		$(".parameterKey").each(function(){
			key.push($(this).val());
		});
		var value =[];
		$(".parameterValue").each(function(){
			value.push($(this).val());
		});
		var parameters =[];
		for(var i in key){
			//[{"key":"平民装","value":"200"},{"key":"豪华型","value":"500"}]
			var parameter = {
					"key":key[i],"value":value[i]
			}
			parameters.push(parameter);
		}
		$("[name='customProperties']").val(JSON.stringify(parameters));
	}
	
	
	
	
	//监听form表单提交事件并且重写
	$("#form", $.pdialog.getCurrent()).submit(function() {
		format();
		return validateCallback(this, dialogAjaxDone);
	})
	function format() {
		$(".number").each(function() {
			var name = $(this).attr("id");
			var val = $(this).val();
			$("#form", $.pdialog.getCurrent()).append("<input type='hidden' name='" + name + "' value='" + numMulti(val, 100) + "' />");
		});
	}
	/**
	 * 乘法运算，避免数据相乘小数点后产生多位数和计算精度损失。
	 *
	 * @param num1被乘数 | num2乘数
	 */
	function numMulti(num1, num2) {
		var baseNum = 0;
		try {
			baseNum += num1.toString().split(".")[1].length;
		} catch (e) {
		}
		try {
			baseNum += num2.toString().split(".")[1].length;
		} catch (e) {
		}
		return Number(num1.toString().replace(".", "")) * Number(num2.toString().replace(".", "")) / Math.pow(10, baseNum);
	};
	
	
</script>

